<template>
    <div class="shouNav">
        <ul class="navList">
            <li>
                <img src="../../assets/img/首页/导航/时令水果.png" alt="">
                <span>时令水果</span>
            </li>
            <li>
                <img src="../../assets/img/首页/导航/新鲜蔬菜.png" alt="">
                <span>新鲜蔬菜</span>
            </li>
            <li>
                <img src="../../assets/img/首页/导航/海鲜水产.png" alt="">
                <span>海鲜水产</span>
            </li>
            <li>
                <img src="../../assets/img/首页/导航/肉禽蛋类.png" alt="">
                <span>肉禽蛋品</span>
            </li>
            <li>
                <img src="../../assets/img/首页/导航/食品干货.png" alt="">
                <span>食品干货</span>
            </li>            <li>
                <img src="../../assets/img/首页/导航/美妆个护.png" alt="">
                <span>美妆个护</span>
            </li>            <li>
                <img src="../../assets/img/首页/导航/母婴百货.png" alt="">
                <span>母婴百货</span>
            </li>            <li>
                <img src="../../assets/img/首页/导航/保健滋补.png" alt="">
                <span>保健滋补</span>
            </li>            <li>
                <img src="../../assets/img/首页/导航/中外名酒.png" alt="">
                <span>中外名酒</span>
            </li>            <li>
                <img src="../../assets/img/首页/导航/彩妆时尚.png" alt="">
                <span>彩妆时尚</span>
            </li>
        </ul>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.shouNav {
    width: 100%;
    background-color: #FFFFFF;
    border-radius:15px;
    margin:10px 0;

    .navList {
        display:flex;
        flex-wrap: wrap;
        justify-content: center;
        align-content: center;
        padding:10px 0;
        li {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin:5px 3px;

            img {
                width: 60px;
                margin-bottom:5px;
            }
            span{
                font-size: 15px;
            }
        }
    }
}
</style>